<template>
  <div>
    <h1>父组件</h1>
    <p>{{ money }}</p>
    <hr>
    <!-- 1. 父传子=》动态属性的绑定 -->
    <!-- <Son :money="money"></Son> -->
    <Son 
    :money="money" 
    :parentFn="parentFn"
    @changeMoney="parentFn"
    ></Son>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import Son from './son.vue'
import axios from 'axios'
// 说明：默认情况下lodash不支持 ts 项目，因为没有提供类型声明文件
import _ from 'lodash'
import {add} from '../../utils/index'

const money = ref(100)
// 父组件中的方法
/**
 * 
 * @param sonData 子组件传过来的数据
 */
const parentFn = (sonData:number) => {
  console.log('子组件调用父组件的方法', sonData)
  money.value = sonData
}

const list:number[] = []
onMounted(()=>{
  axios.get
  list.unshift(100)
  document.title = list.length + '个'
  console.log(_.isArray(list))
  console.log(add(1,3))
})

</script>

<style scoped>

</style>